<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    <meta name="viewport" id="viewport" content="target-densitydpi=1,width=device-width,user-scalable=no,initial-scale=1,minimum-scale=1" />
<title>注册界面</title>
<link rel="stylesheet" href="/css/reset.css" />
<link rel="stylesheet" href="/css/common.css" />
<link rel="stylesheet" href="/css/font-awesome.min.css" />
<style type="text/css">
	div {
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		background-image: url(/images/logo_bg.jpg);
		background-position: center 0;
		background-repeat: no-repeat;
		background-size: 100% auto;
	}
</style>
</head>
	<body>
		<div class="wrap login_wrap">
			<div class="content">
				
				<div class="logo"></div>
				
				<div class="login_box">	
					
					<div class="login_form">
						<div class="login_title">
							注册
						</div>
						<form action="/login/register" method="post">
							
							<div class="form_text_ipt">
								<input name="userName" type="text" placeholder="用户名">
							</div>
							<div class="ececk_warning"><span>用户名不能为空</span></div>
							<div class="form_text_ipt">
								<input name="password" type="password" placeholder="密码">
							</div>
							<div class="ececk_warning"><span>密码不能为空</span></div>
							<div class="form_text_ipt">
								<input name="repassword" type="password" placeholder="重复密码">
							</div>
							<div class="ececk_warning"><span>密码不能为空</span></div>
							<div class="form_text_ipt">
								<input name="sex" type="text" placeholder="性别:1-男 0-女"/>
							</div>
							<div class="ececk_warning"><span>性别不能为空</span></div>
							
							<div class="form_btn">
								<button type="submit">注册</button>
							</div>
							<div class="form_reg_btn">
								<span>已有帐号？</span><a href="/login/main">马上登录</a>
							</div>
						</form>
						<div class="other_login">

						</div>
					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript" src="/js/jquery-1.8.0.min.js" ></script>
		<script type="text/javascript" src="/js/common.js" ></script>
		<div style="text-align:center;">
</div>
        <script type="text/javascript">
            var bg_auto_size = function(src) {
                var dh = document.documentElement.clientHeight;
                var dw = document.documentElement.clientWidth;
                var img_url = src;
                var img = new Image();
                img.src = img_url;
                img.onload = function() {
                    var dRatio = dw / dh;
                    var imgRatio = img.width / img.height;
                    if(dRatio <= imgRatio) {
                        $('div').css({ 'background-size': 'auto 100%', 'background-position': 'center 0' });
                    } else {
                        $('div').css({ 'background-size': '100% auto', 'background-position': 'center 0' });
                    }
                }
            };
            //这个图片的地址必须是绝对路径，如果用相对路径就会报错，文件识别不出，下面路径是我随便找的，不是实际背景的真实绝对路径
            var bg = '/images/logo_bg.jpg';
            bg_auto_size(bg);
        </script>
	</body>
</html>
